<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <#include "../include/layui.ftl" />
    <link rel="stylesheet" type="text/css" href="${path}/css/home.css">
    <title>layuiAdmin 控制台主页一</title>
    <style type="text/css">
        .layui-card-header {border-bottom: 0px;font-size: 16px;padding-top: 10px;padding-left: 20px;}
        .layadmin-shortcut li .layui-icon {height: 60px;line-height: 60px;}
        .short_li_hover:hover{background-color: #FD9FC3 !important;}
        .layui-carousel>[carousel-item]>.layui-this {left: 10;}
    </style>
</head>
<body>

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md8">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md6">
                    <div class="layui-card">
                        <div class="layui-card-header">快捷方式</div>
                        <div class="layui-card-body">

                            <div class="layui-carousel layadmin-carousel layadmin-shortcut">
                                <div carousel-item>
                                    <ul class="layui-row layui-col-space10" id="shortcut_ul">
                                    </ul>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <div class="layui-col-md6">
                    <div class="layui-card">
                        <div class="layui-card-header">数据统计</div>
                        <div class="layui-card-body">

                            <div class="layui-carousel layadmin-carousel layadmin-backlog">
                                <div carousel-item id="unhandledEvent_ul">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-header">数据概览</div>
                        <div class="layui-card-body">

                            <div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" lay-filter="LAY-index-dataview">
                                <div carousel-item id="LAY-index-dataview">
                                    <div><i class="layui-icon layui-icon-loading1 layadmin-loading"></i></div>
                                    <#if SESSION_USER.user.isSysAdm()>
                                        <div></div>
                                    </#if>
                                </div>
                            </div>

                        </div>

                    </div>
                </div>
            </div>
        </div>

        <div class="layui-col-md4">
            <div class="layui-card">
                <div class="layui-card-header">会员信息</div>
                <div class="layui-card-body layui-text">
                    <table class="layui-table">
                        <colgroup>
                            <col width="100">
                            <col>
                        </colgroup>
                        <tbody>
                        <tr>
                            <td>到期时间</td>
                            <td><span id="check_time"></span></td>
                        </tr>
                        <tr>
                            <td>剩余天数</td>
                            <td>
                                <span id="check_date"></span>
                            </td>
                        </tr>
                        <tr>
                            <td>剩余次数</td>
                            <td><span id="check_number"></span></td>
                        </tr>
                        <tr>
                            <td>会员管理</td>
                            <td style="padding-bottom: 0;">
                                <div class="layui-btn-container">
                                    <a id="recharge" class="layui-btn layui-btn-danger">续费</a>
                                </div>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

    </div>
</div>

<script>
    layui.config({
        base: '${path}/plug-in/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'home']);




    layui.use(['layer', 'jquery'], function () { //, 'echarts'
        var layer = layui.layer,
            $ = layui.jquery;
            // echarts = layui.echarts;
        $.getJSON("/console/menu/rewrite/shortCutList", {}, function (rep) {
            var htmlPanel = [];
            $.each(rep.data, function (j, child) {
                var url = (child.menuUrl) ? child.menuUrl + '?menuId=' + child.id + '&menuIcon=' + child.menuIcon + '&menuName=' + encodeURI(child.menuName) : 'javascript:;';
                var icon = child.menuIcon || "layui-icon-rate";
                htmlPanel.push('<li class="layui-col-xs3" menuid="' + child.id + '" ><a href="' + url + '"><i class="layui-icon short_li_hove ' + icon + '"></i><cite>' + child.menuName + '</cite></a></li>');
            });
            $("#shortcut_ul").html(htmlPanel.join(''));
        });

        $.getJSON("/console/menu/rewrite/unhandledEvent", {}, function (rep) {
            var htmlPanel = [];
            htmlPanel.push('<ul class="layui-row layui-col-space10" >');
            $.each(rep.data, function (j, child) {
                if(j % 4 == 0 && j != 0){
                    htmlPanel.push('</ul >');
                    htmlPanel.push('<ul class="layui-row layui-col-space10" >');
                }
                htmlPanel.push('<li class="layui-col-xs6" ><a class="layadmin-backlog-body"><h3>'+ child.menuName +' </h3><p><cite>' + child.menuCount + '</cite></p></a></li>');
            });
            htmlPanel.push('</ul >');
            $("#unhandledEvent_ul").html(htmlPanel.join(''));
        });
        getCount();
        $("#recharge").click(function(){
            layer.open({
                type:2,
                title:"充值中心",
                content:"/console/recharge/rewrite/viewRecharge",
                area: ['680px', '580px'],
                btn:['关闭'],
                btn1:function(index, layero){
                    getCount();
                    layer.close(index);
                }
            });
        });
        function DateMinus(time){
            var sdate = new Date(time);
            var now = new Date(getNowFormatDate());
            var days = now.getTime() - sdate.getTime();
            var day = parseInt(days / (1000 * 60 * 60 * 24));
            return day;
        }
        function getNowFormatDate() {
            var date = new Date();
            var seperator1 = "-";
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var strDate = date.getDate();
            if (month >= 1 && month <= 9) {
                month = "0" + month;
            }
            if (strDate >= 0 && strDate <= 9) {
                strDate = "0" + strDate;
            }
            var currentdate = year + seperator1 + month + seperator1 + strDate;
            return currentdate;
        }
        function getCount(){
            $.getJSON("/console/user/rewrite/getLoginUser",null,function(rep){
                if (rep.flag) {
                    var count = rep.data.count;
                    var startTime = rep.data.startTime;
                    var endTime = rep.data.endTime;
                    var member = "";
                    var time = "";
                    if((startTime == '' || startTime == undefined) && (endTime == '' || endTime == undefined)){
                        member = "<b>普通会员</b>";
                        time = "<b>无</b>";
                    }else{
                        var day = DateMinus(endTime);
                        time = "<b>"+endTime+"</b>";
                        if(day >= 0){
                            member = "<b style='color:red;'>已过期</b>";
                        }else{
                            day = Math.abs(day);
                            member = "<b style='color:blue;'>"+day+"天</b>";
                        }
                    }
                    $("#check_date").html(member);
                    $("#check_time").html(time);
                    var html = count > 10?  "<b style='color:blue;'>"+count+"</b>" : "<b style='color:red;'>"+count+"</b>"
                    $("#check_number").html(html);
                }
            });
        }
    });



</script>
</body>
</html>

